<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('待查确认')" />
	<th:block th:include="include :: select2-css" />
	<th:block th:include="include :: bootstrap-editable-css" />
	<th:block th:include="include :: datetimepicker-css" />
</head>
<body class="gray-bg">
    <div class="main-content">
        <form id="form-dccm-add" class="form-horizontal">
            <input id="afc401" name="afc401" type="hidden" th:value="${dclshs}"/>
            <input id="zje" name="zje" type="hidden" th:value="${zje}"/>
            <h4 class="form-header h4">基本信息,原待查总金额为:<span style="color: red; "><label th:text="${zje}"></label></span></h4>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>票号：</label>
                         <div class="col-sm-8">
                            <div class="input-group">
                              <input id="afc001" name="afc001"  class="form-control" onkeydown="onKeyDown(event)" type="text" maxlength="30"  placeholder="" required>
                              <span class="input-group-addon" onclick="getTzdData()"><i class="fa fa-search"></i></span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>开票日期：</label>
                        <div class="col-sm-8">
                           <input name="afc015" id="afc015"  placeholder="" class="form-control time-input" type="text" maxlength="30"  required>
                        </div>
                    </div>
                </div>
              
            	<div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>缴款人信息：</label>
                        <div class="col-sm-8">
                            <input name="afc006" id="afc006" placeholder="" class="form-control" type="text" th:value="${jkr}" required>
                        </div>
                    </div>
                </div>
                <input id="afa101" name="afa101" type="hidden" th:value="${yhbm}"/>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>收款人名称：</label>
                        <div class="col-sm-8">
                            
                            	<input name="afc002"  id="afc002" type="text" placeholder="" class="form-control" th:value="${skr}" required readonly>
                            
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>缴款人账号：</label>
                        <div class="col-sm-8">
                            <input id="afc008" name="afc008" placeholder="" class="form-control" type="text" maxlength="50" th:value="${jkrzh}" >
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>收款人账号：</label>
                        <div class="col-sm-8">
                            <div class="input-group">
                              <input id="afc004" name="afc004"  class="form-control" type="text" maxlength="50" th:value="${skrzh}" placeholder="" required>
                              <span class="input-group-addon" ><i class="fa fa-search"></i></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">缴款人银行：</label>
                        <div class="col-sm-8">
                            <input id="afc007" name="afc007" placeholder="" class="form-control" type="text" th:value="${jkryhmc}" maxlength="120">
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>收款人银行：</label>
                        <div class="col-sm-8">
                            <input id="afc003" name="afc003" placeholder="" class="form-control" type="text" th:value="${skryhmc}" required>
                        </div>
                    </div>
                </div>
            </div>
             <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>单位编码：</label>
                        <div class="col-sm-8">
	                         <div class="input-group">
	                            <input id="afa051" name="afa051" onclick="selectDwTree()" placeholder="" class="form-control" type="text" th:value="${dwbm}" required readonly>
	                             <span class="input-group-addon"><i class="fa fa-search" onclick="selectDwTree()"></i></span>
	                        </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>单位名称：</label>
                        <div class="col-sm-8">
                            <input id="afa052" name="afa052" placeholder="" class="form-control" type="text" th:value="${dwmc}" required readonly>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="container-div">
        <div class="btn-group-sm" id="toolbar" role="group">
             <a class="btn btn-success" onclick="insertRow()">
		            <i class="fa fa-plus"></i> 新增行
		        </a>
		        <a class="btn btn-danger multiple disabled" onclick="removeRow()">
		            <i class="fa fa-remove"></i> 删除选择行
		        </a>
        </div>
		<div class="row">
			<div class="col-sm-12 select-table">
				<table id="bootstrap-table"></table>
			</div>
		</div>
	</div>
	<th:block th:include="include :: footer" />
	<th:block th:include="include :: bootstrap-table-editable-js" />
	<th:block th:include="include :: datetimepicker-js" />
	<script>
	    $("#afc015").datetimepicker({
		   format: 'yyyy-mm-dd',
           language: 'zh-CN',
           todayBtn: false,
           autoclose: true
		});
	    $("#afc015").datetimepicker('setDate', (new Date()) );
	    var prefix=ctx + "system/dcjtmx";	   
			$(function() {
		        var options = {
	        		showSearch: false,
			        showRefresh: false,
			        showToggle: false,
			        showColumns: false,
			        pagination: false,
			        striped : true,
			        uniqueId: 'id',
			        height: 220,
			        editable:true,//开启编辑模式  
			        clickToSelect: true,
		            columns: [{
			            checkbox: true
			        },
					{
						field : 'id', 
						title : 'id',
						visible: false
					}, {
	                    title: '项目选择',
	                    align: 'center',
	                    align: 'left',
	                    formatter: function(value, row, index) {
	                        var actions = [];
	                        actions.push('<a class="btn btn-info  btn-xs" href="javascript:void(0)" onclick="selectxmxxTree(' + index + ')"><i class="fa fa-plus"></i>选择</a> ');
	                        return actions.join('');
	                    }
	                },{
	                    field: 'afa031',
	                    title: '项目代码',
	                },{
	                    field: 'afa032',
	                    title: '项目名称',
	                },
					{
						field : 'afc011', 
						title : '项目金额',
						width :200,
						editable : {
							type : 'text',
							title : '项目金额',
							emptytext : "录入项目金额",
							mode: "inline",
							validate : function(value) {
								   if (!value) return '【项目金额】不能为空';
				                    var patrn=/^([1-9]\d*\.\d{1,2}|0\.\d[1-9]|[1-9]\d*)$/;
					                if(!patrn.test(value)){
					               		 return '输入格式：最多两位小数';
					                }
							}
						}
					}]
		        };
		        $.table.init(options);
		    }); 
			
				
	    /* 新增表格行 */
	    function insertRow(){
	    	var data=$("#" + table.options.id).bootstrapTable('getData');
	    	if (data.length>=3){
	    		 layer.alert("<font color='red'>缴款书最多只能增加三个项目!</font>", {
     		        icon: 0,
     		        title: "系统提示"
	     		 })
	     		 return;
	    	}
	    	var randomId = 100 + ~~(Math.random() * 100);
	    	var row={
	            	id:randomId,
	            	afa031: '',
	            	afa032: '',
	            	afc011: ''
	            }
	    	$("#" + table.options.id).bootstrapTable('append', row)
	    }
	    
	    /* 删除指定表格行 */
	    function removeRow(){
	    	var ids = $.table.selectColumns("id");
	    	if (ids.length == 0) {
				$.modal.alertWarning("请至少选择一条记录");
				return;
			}
	    	$("#" + table.options.id).bootstrapTable('remove', {
	    	    field: 'id',
	    	    values: ids
	    	})
	    }
	    
	    
	    
	    /*会计科目-新增-选择父部门树*/
        function selectxmxxTree(upIndex) {
        	if ($("#afa051").val()==undefined|| $("#afa051").val()==''){
        		 layer.alert("请先选择单位", {
      		        icon: 0,
      		        title: "系统提示"
 	     		 })
 	     		 return;
        	} 
            var options = {
            	title: '项目'+'_'+upIndex,
                width: "380",
                url: ctx + "system/xmxx/selectXmxxTree/"+$("#afa051").val(),
                callBack: doxmxxSubmit
            };
            $.modal.openOptions(options);
        }

        function doxmxxSubmit(index, layero){
        	var tree = layero.find("iframe")[0].contentWindow.$._tree;
			//if ($.tree.notAllowParents(tree)) {
        	   var titile=$(".layui-layer-title")[0].innerText;
	     	   var rowIndex=0;
	     	   if (titile!=undefined){
	     		   rowIndex=titile.split('_')[1];
	     	   }
               var body = layer.getChildFrame('body', index);
               var yskmdm=body.find('#treeId').val();
               var yskmdmName=body.find('#treeTitle').val().split('^')[0];
               
               var rowskmdm = {
            		   index : rowIndex, //更新列所在行的索引
            		   field : "afa031", //要更新列的field
            		   value : yskmdm //要更新列的数据
            		   }//更新表格数据 
               $("#" + table.options.id).bootstrapTable("updateCell",rowskmdm);
         	   var kmdmName = {
                 		   index : rowIndex, //更新列所在行的索引
                 		   field : "afa032", //要更新列的field
                 		   value : yskmdmName //要更新列的数据
                 		   }//更新表格数据 
               $("#" + table.options.id).bootstrapTable("updateCell",kmdmName);
               layer.close(index);
			//}
        }
        
        function submitHandler() { 
	        if ($.validate.form()) {
	        	var data = $("#form-dccm-add").serializeArray();
	        	var itemmx = $("#" + table.options.id).bootstrapTable('getData');
	        	if(itemmx.length == 0){
	        		 layer.alert("<font color='red'>请录入项目信息</font>", {
	        		        icon: 0,
	        		        title: "系统提示"
	        		 })
	        		 return;
	        		
	        	}
	        	var dateIds = new Array();
	        	var itemje=0;
	        	$.each(itemmx, function (key, value) {
                     if (value.afa031==''){
                    	 dateIds.push("1");
                    	 return false; 
                     }
                     if (value.afc011<=0){
                    	 dateIds.push("1");
                    	 return false; 
                     }
                     itemje=itemje+Number(value.afc011);
                 });
	        	if(dateIds.length>0){
	        		 layer.alert("<font color='red'>项目或项目金额不符!</font>", {
	        		        icon: 0,
	        		        title: "系统提示"
	        		 })
	        		 return;
	        	}
	        	for(var i=0;i<itemmx.length;i++){
	        		for(var j=i+1;j<itemmx.length;j++){
	        			if (itemmx[i].afa031==itemmx[j].afa031){
	        				layer.alert("<font color='red'>存在相同的项目编码!</font>", {
		        		        icon: 0,
		        		        title: "系统提示"
			        		})
			        		return;
	        			}
	        		}
	        	}
	        	var zje=$("#zje").val();
	        	debugger;
	        	if (Number(zje)!=Number(itemje)){
	        		layer.alert("<font color='red'>确认金额与待查金额不符!</font>", {
        		        icon: 0,
        		        title: "系统提示"
	        		})
	        		return;
	        	}
	        	var jsonitemmx=JSON.stringify(itemmx)
	        	data.push({"name": "afd201", "value": jsonitemmx});
	        	$.operate.save(prefix + "/addsave", data);
	        }
	    }
        
		 
		  /*用户管理-新增-选择部门树*/
        function selectDwTree() {
			var options = {
				title: '选择单位',
				width: "420",
				url: ctx + "system/hsdw/selectHsdwTree/",
				callBack: dwdoSubmit
			};
			$.modal.openOptions(options);
		}
		
		function dwdoSubmit(index, layero){
			var tree = layero.find("iframe")[0].contentWindow.$._tree;
			if ($.tree.notAllowParents(tree)) {
				var body = layer.getChildFrame('body', index);
    			var dw=body.find('#treeName').val();
    			$("#afa051").val(body.find('#treeId').val());
    			$("#afa052").val(dw.split('-')[1]);
    			layer.close(index);
			}
		}
		function getTzdData(){
		    $.ajax({
                url: ctx + "opreation/affirm/gettzd",
                async: false,
                type: "POST",
                data: {afc001:$("#afc001").val(),afa051:$("#afa051").val()},
                dataType: 'json',
                success: function (data, status) {
                	$("#" + table.options.id).bootstrapTable('removeAll');
                    $.each(data, function (key, value) {
                    	$("#afc001").val(value.afc001);
                    	$("#afc015").val(value.afc015);
                    	$("#afc002").val(value.afc002);
                    	$("#afc003").val(value.afc003);
                    	$("#afc004").val(value.afc004);
                    	$("#afc006").val(value.afc006);
                    	$("#afc007").val(value.afc007);
                    	$("#afc008").val(value.afc008);
                    	$("#afa101").val(value.afa101);
                    	$("#afa051").val(value.afa051);
                    	$("#afa052").val(value.afa052);
                    	var randomId = 100 + ~~(Math.random() * 100);
            	    	var row={
            	            	id:randomId,
            	            	afa031: value.afa031,
            	            	afc011: value.afc011
            	            }
            	    	$("#" + table.options.id).bootstrapTable('append', row)
                    });
                }
            });
		}
		function onKeyDown(event){
               var e = event || window.event || arguments.callee.caller.arguments[0];
               if(e && e.keyCode==13){ // enter 键
            	   getTzdData();
               }
               
           }
    </script>
</body>
</html>
